<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>mydemo</title>
	<style>
		body {font:12px/1.5 Arial; color:#0aa;}
		p {border:1px dashed black; padding:10px;}
		input {cursor:pointer;}
	</style>
	<script>		
		window.onload = function() {
			var oP = document.getElementsByTagName("p");
			var oInput = document.getElementsByTagName("input");
			var count = 0;
			//
			//
			//oInput[0]和oInput[1]的功能一样，
			oInput[1].onclick = function() {
				var aP = oP[0].innerHTML.split(",");
				// if(count == 0){aP.splice(0,1);oP[0].innerHTML=aP;this.value="添加January(1)";count=1}
				// else{aP.splice(0,0,"January(1)");oP[0].innerHTML=aP;this.value="删除January(1)";count=0}
				// 注意：如果使用三元表达式，表达语句中的多重语句，需要用英文逗点分割，不能使用分号。
				count == 0 ? 
				(aP.splice(-1,1),oP[0].innerHTML=aP,this.value="添加January(12)",count=1) : 
				(aP.splice(-1,0,"January(12)"),oP[0].innerHTML=aP,this.value="删除January(12)",count=0);
			}
			//
			//
			//数组的复制和还原			
			oInput[2].onclick = function() {
				var bP = oP[1].innerHTML.split(",");
				var x = bP.splice(0);
				//oP[1].innerHTML += ","+x; //只复制原始数据
				oP[1].innerHTML = x.concat(x);
			}
			oInput[3].onclick = function() {
				var bbP = oP[1].innerHTML.split(",");
				var y = bbP.splice(0,10);
				oP[1].innerHTML = y;
			}
			//
			//
			//还原：
			var cP = oP[2].innerHTML.split(",");
			oInput[4].onclick = function() {
				var x = "red,green,blue,white,yellow,black,brown";
				oP[2].innerHTML = x;
			}
			oInput[5].onclick = function() {
				cP.splice(0,3);
				oP[2].innerHTML = cP;
			}
			oInput[6].onclick = function() {
				cP.splice(1,2);
				oP[2].innerHTML = cP;
			}
			oInput[7].onclick = function() {
				cP.splice(1,0,"orange","purple");
				oP[2].innerHTML = cP;
			}
			oInput[8].onclick = function() {
				cP.splice(1,2,"orange","purple");
				oP[2].innerHTML = cP;
			}
		}
	</script>
</head>
<body>
	<p>January(1),February(2),March(3),April(4),May(5),June(6),July(7),Aguest(8),September(9),October(10),November(11),December(12)</p>
	<input type="button" value="删除January(1)">
	<input type="button" value="删除December(12)">
	<p>0,1,2,3,4,5,6,7,8,9</p>
	<input type="button" value="复制">
	<input type="button" value="还原">
	<p>red,green,blue,white,yellow,black,brown</p>
	<input type="button" value="还原">
	<input type="button" value="删除前三项">
	<input type="button" value="删除第二至三项">
	<input type="button" value="在第二项前插入(orange,purple)">
	<input type="button" value="替换第二项和第三项">
</body>
</html>